<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="renderer" content="webkit">
    <link rel="stylesheet" type="text/css" href="../css/style.css">
    <script type="text/javascript" src="../js/index_zns_1.js"></script>
  </head>
  <body>
    <div class="mask" id="mask"></div>
    <h1>第一课 面向对象的选项卡</h1>
    <p>把面向过程的选项卡做成面向对象的选项卡</p>
    <div class="div1" id="div1">
      <input class="active" type="button" value="aaa">
      <input type="button" value="bbb">
      <input type="button" value="ccc">
      <div style="display:block;">第1个tab的对应内容</div>
      <div>第二个tab </div>
      <div>第san个的对应内容</div>
    </div>
    <h1 class="block">妙味课堂--js初级-热身（上下）课后作业</h1>
    <h3 class="mwjs-1-title">点击更改div的样式
      <input id="mwjs1BtnSet" type="button" value="点我设置吧!">
    </h3>
    <div class="mwjs-1-by-seted" id="mwjs1bySeted"></div>
    <div id="mwjsPopWrap">
      <h4>点击按钮尽情的设置样式吧！<span id="mwjsPopClose">X</span></h4>
      <div class="mwjs-p-wrap">
        <p> 
          <input class="mwjs-1-btn-text" type="button" value="设置宽度：">
          <input class="mwjs-1-seting-cur" id="mwjsWidth200" type="button" value="200">
          <input id="mwjsWidth300" type="button" value="300">
          <input id="mwjsWidth500" type="button" value="500">
        </p>
        <p> 
          <input class="mwjs-1-btn-text" type="button" value="设置高度：">
          <input id="mwjsHeight200" type="button" value="200">
          <input id="mwjsHeight300" type="button" value="300">
          <input id="mwjsHeight500" type="button" value="500">
        </p>
        <p> 
          <input class="mwjs-1-btn-text" type="button" value="边框粗细：">
          <input id="mwjsBorder4" type="button" value="4">
          <input id="mwjsBorder6" type="button" value="6">
          <input id="mwjsBorder8" type="button" value="8">
        </p>
        <p> 
          <input class="mwjs-1-btn-text" type="button" value="背景颜色：">
          <input id="mwjsBorderRed" type="button" value="红">
          <input id="mwjsBorderYellow" type="button" value="黄">
          <input id="mwjsBorderBlue" type="button" value="蓝">
        </p>
      </div>
      <p class="mwjs1-submit-wrap">
        <input id="mwjs1Reset" type="button" value="重来">
        <input id="mwjs1Submit" type="button" value="确认">
      </p>
    </div>
    <h4 class="info">问题汇总
      <p>js怎么设置渐变的舒缓动画，比如我想让它出现的缓慢一点不要突兀，（参照setInterval的动画，在规定的时间内增加透明度）</p>
      <p>js怎么查找其他子元素，比如我想让这个元素点击后他选中类名增加，其他兄弟的类名去掉（参照tab选项卡）</p>
    </h4>
    <h1 class="block">日期格式化函数</h1>
    <div class="time-wrap">
      <p id="time-box"></p>
      <p id="time-show"></p>
    </div>
  </body>
  <script>
      console.log(fun)
  
      console.log(person)
  </script>
  
  <script>
      console.log(person)
  
      console.log(fun)
  
      var person = "Eric";
  
      console.log(person)
  
      function fun() {
          console.log(person)
          var person = "Tom";
          console.log(person)
      }
  
      fun()
  
      console.log(person)
  </script>
</html>